<%--
  Created by IntelliJ IDEA.
  User: Lenovo
  Date: 2023/10/10
  Time: 17:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>审核员工</title>
    <%--引入vue的js--%>
    <script src="../../js/vue.js"></script>
    <!-- 引入组件库 -->
    <script src="../../js/index.js"></script>
    <!--引入axios的依赖-->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <!-- import CSS -->
    <link rel="stylesheet" href="../../css/index.css">

</head>
<body>
<div id="app">
    <el-form :inline="true" :model="staffForm" class="demo-form-inline">
        <el-form-item label="">
            <el-select v-model="staffForm.branchid" clearable placeholder="主页">
                <el-option v-for="b in branchs" :key="b.branchid" :label="b.branchname" :value="b.branchid">
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="search">搜索</el-button>
        </el-form-item>
    </el-form>
    <el-table
            :data="staffs"
            style="width: 100%"
    >
        <el-table-column
                prop="id"
                label="ID"
        >
        </el-table-column>
        <el-table-column
                prop="staffname"
                label="员工姓名"
        >
        </el-table-column>
        <el-table-column
                prop="oldbranchname"
                label="旧分店"
        >
        </el-table-column>
        <el-table-column
                prop="olddeptname"
                label="旧部门"
        >
        </el-table-column>
        <el-table-column
                prop="newbranchname"
                label="新分店"
        >
        </el-table-column>
        <el-table-column
                prop="newdeptname"
                label="新部门"
        >
        </el-table-column>
        <el-table-column
                prop="applytime"
                label="申请时间"
        >
        </el-table-column>
        <el-table-column
                prop="sqr"
                label="申请人"
        >
        </el-table-column>
        <el-table-column
                prop="extime"
                label="审核时间"
        >
        </el-table-column>


        <el-table-column
                v-if="false"
                prop="branchid"
        >
        </el-table-column>

        <el-table-column
                v-if="false"
                prop="deptid"
        >
        </el-table-column>
        <el-table-column
                v-if="false"
                prop="staffid"
        >
        </el-table-column>
        <el-table-column
                v-if="false"
                prop="roleid"
        >
        </el-table-column>
        <el-table-column
                v-if="false"
                prop="newbranchid"
        >
        </el-table-column>
        <el-table-column
                v-if="false"
                prop="newdeptid"
        >
        </el-table-column>

        <el-table-column
                prop="shr"
                label="审核人"
        >

        </el-table-column>
        <el-table-column
                prop="state"
                label="状态">
            <termplate slot-scope="scope">
                <el-tag
                        type="warning"
                        v-if="scope.row.state==1"
                        effect="dark">
                     待审核
                </el-tag>
                <el-tag
                        type="success"
                        v-if="scope.row.state==2"
                        effect="dark">
                    申请通过
                </el-tag>
                <el-tag
                        type="danger"
                        v-if="scope.row.state==3"
                        effect="dark">
                    申请驳回
                </el-tag>
            </termplate>

        </el-table-column>
        <el-table-column
                fixed="right"
                label="操作"
                width="300">
            <template slot-scope="scope">
                <div>
                    <el-button
                            size="mini"
                            type="primary"
                            v-if="scope.row.state===1"
                            @click="handleEdit(scope.row)">通过
                    </el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            v-if="scope.row.state===1"
                            @click="handleDelete(scope.row)">驳回
                    </el-button>
                </div>
            </template>
        </el-table-column>
    </el-table>
    <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="current"
            :page-sizes="[5, 10, 15, 20]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total">
    </el-pagination>
</div>
</body>
<script>
    let app = new Vue({
        el: "#app",
        data: {

            //所有员工信息
            staffs: [],
            //总条数
            total: 0,
            //每页显示的大小
            pageSize: 5,
            //当前页码
            current: 1,
            //表单搜索对象
            staffForm: {},
            //branchs所有门店的列表
            branchs: [],
            //
            tableRowClassName:111

        },
        created() {
            this.initTable();
        },
        methods: {
            initTable() {
                axios.post("/stafftransfer/list?current=" + this.current + "&pageSize=" + this.pageSize, this.staffForm).then(function (resp) {
                    console.log("1111",resp)
                    app.staffs = resp.data.data.list;
                    app.total = resp.data.data.total;
                })
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.initTable()
            },
            handleCurrentChange(val) {
                this.current = val;
                this.initTable();
            },
            //搜索
            search() {
                this.initTable();
            },
            handleEdit(row){
                axios.post("/stafftransfer/update1" ,row).then(resp=>{
                    console.log(resp)
                    if (resp.data.code==500){
                        this.$message({
                            type: 'error',
                            message: resp.data.msg
                        });
                    }else{
                    this.$message({
                        type: 'success',
                        message: '审核通过!'
                    });
                    this.initTable();
                    }
                })
            },
            handleDelete(row){
                axios.post("/stafftransfer/update2" ,row).then(resp=>{
                    this.$message({
                        type: 'danger',
                        message: '驳回成功!'
                    });
                    this.initTable();
                })
            }


        }
    })
</script>
</html>
